<template>
  <div class="container">
    <nav-bar style="background-color: #0689f4; color: #fff">
      <div slot="center">故障详情</div>
    </nav-bar>
    <div class="check content-top">
      <div class="van-title" style="margin: 5px"></div>
      <van-form @submit="onSubmit(checkInfo)"> 
        <van-field
          readonly 
          v-model="checkInfo.deviceName"
          name="checkInfo.deviceName"
          label="设备名称"
          placeholder="设备名称"
        />
        <van-field
          v-model="checkInfo.checkName"
          name="checkInfo.checkName"
          label="点检装置"
          placeholder="点检装置"
          readonly 
        />
        <van-field
          readonly
          clickable
          v-model="checkInfo.checkTime"
          name="checkInfo.checkTime"
          label="检查日期"
          
        />

        <van-cell-group
          style="margin-top: 2px"
          v-for="(info, index) in checkInfo.checkContent"
          :key="index"
        >
          <div class="content-title" style="font-size: 16px">
            {{index + 1}}.{{ info.title }}
          </div>
          <van-field label="状况" readonly >
            <template #input>
              <van-radio-group v-model="info.status" direction="horizontal" disabled >
                <van-radio name="1">正常</van-radio>
                <van-radio name='2'>异常</van-radio>
              </van-radio-group>
            </template>
          </van-field>
          
          <van-field
          readonly 
            v-model="info.text"
            rows="1"
            autosize
            label="备注"
            type="textarea"
            placeholder="请输入备注"
          />
          <van-field name="uploader" label="照片"  >
            <template #input>
              <van-uploader v-model="info.imgUrl" :max-size="5 * 1024 * 1024" @oversize="onOversize" :after-read="afterRead" />
            </template>
          </van-field>
        </van-cell-group>

        <div style="margin: 16px">
          <!-- <img
            src="http://192.168.1.248:7070/getImg?imgName=fill-2-8"
            alt=""
          /> -->
          <!-- <van-button round block type="info" native-type="submit" 
            >提交</van-button> -->
        </div>
      </van-form>
    </div>
  </div>
</template>

<script>
import NavBar from "@/components/NavBar.vue";
import { Dialog } from "vant"; 
export default {
  name: "taskDetail",
  components: {
    [Dialog.Component.name]: Dialog.Component,
    NavBar,
  },
  props: {},
  data() {
    return {
      showPicker: false,
      minDate: new Date(2021, 1, 1),
      maxDate: new Date(2024, 12, 30),
      currentDate: new Date(),
      checkInfo: {
        username: "测试点检员",
        checkName: this.$route.params.equipment,
        checkId:'',
        deviceId: '',
        deviceName: this.$route.params.name,
        // checkTime: this.$moment().format("YYYY-MM-DD HH:mm:ss"),
        checkTime: '2021-12-03 15:23:32',
        checkContent: [
          {title:'脉冲阀频率20-22次/10s',status:'2',text:this.$route.params.text,imgUrl:[{ url: 'https://img01.yzcdn.cn/vant/leaf.jpg' }]}
        ],
      },
    };
  },
  computed: {},
  watch: {},
  created() { },
  mounted() {},
  methods: {
    //获取设备的名字  
  },
};
</script>

<style scoped lang="less">
.container {
  .check {
    .van-title {
      padding: 2px 16px 2px 16px;
      color: rgba(69, 90, 100, 0.6);
      font-size: 16px;
      font-weight: normal;
    }
    .content-title {
      display: flex;
      box-sizing: border-box;
      padding: 10px 16px;
      border-bottom: 1px solid #ebedf0;
    }
  }
}
</style>